<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <title>地图遮罩</title>
    <style>
    html,
    body,
    #container {
        margin:0;
        height: 100%;
    }
    </style>
</head>
<body>
<div id="container"></div>
<script>
			window._AMapSecurityConfig = {
				securityJsCode: 'd52e662b3da181d922ae7d0939be19ff',
			}
		</script>
<script src="https://webapi.amap.com/maps?v=1.4.15&key=d3b6464934c87bbb494d6fff68ba8ab4&plugin=AMap.DistrictSearch,Map3D,AMap.DistrictLayer,AMap.Scale,AMap.ToolBar"></script>
<script>
    function getParams(key) {
        var reg = new RegExp("(^|&)" + key + "=([^&]*)(&|$)"); 
       //如果地址栏中出现中文则进行编码    
        var r = encodeURI(window.location.search).substr(1).match(reg);  
        if (r != null) {  
            //将中文编码的字符重新变成中文
            return decodeURI(unescape(r[2]));  
        }  
        return null;  
    };
    const newName = getParams('name')
	
	creat('贵州',8)
	var map = new AMap.Map('container', {
		    resizeEnable: true,
		    zoom: 8,
		    center:[106.636577,26.653325],
		    layers:[
		        new AMap.TileLayer.RoadNet({
		            zIndex:20
		        }),
		        new AMap.TileLayer({
		            zIndex:6,
		            opacity:1,
		            getTileUrl:'https://t{1,2,3,4}.tianditu.gov.cn/DataServer?T=ter_w&x=[x]&y=[y]&l=[z]'
		            })]
		});
		
	function creat(reals,ee){
		
		
		new AMap.DistrictSearch({
		    extensions:'all',
		    subdistrict:0
		}).search(reals,function(status,result){
		    // 外多边形坐标数组和内多边形坐标数组
		    var outer = [
		        new AMap.LngLat(-360,90,true),
		        new AMap.LngLat(-360,-90,true),
		        new AMap.LngLat(360,-90,true),
		        new AMap.LngLat(360,90,true),
		    ];
		    var holes = result.districtList[0].boundaries
		
		    var pathArray = [
		        outer
		    ];
			var maskerIn = new AMap.Marker({
				position:[106.636577,26.653325],
				map:map
			})
			
			maskerIn.on('click',function(e){
				destroyMap()
				setTimeout(function() {
					map = new AMap.Map('container', {
					    resizeEnable: true,
					    zoom: ee,
					    center:[106.636577,26.653325],
					    layers:[
					        new AMap.TileLayer.RoadNet({
					            zIndex:20
					        }),
					        new AMap.TileLayer({
					            zIndex:6,
					            opacity:1,
					            getTileUrl:'https://t{1,2,3,4}.tianditu.gov.cn/DataServer?T=ter_w&x=[x]&y=[y]&l=[z]'
					            })]
					});
					creat('贵阳',10)
				}, 10);					
			})
			
		    pathArray.push.apply(pathArray,holes)
		    var polygon = new AMap.Polygon( {
		        pathL:pathArray,
		        strokeColor: '#00eeff',
		        strokeWeight: 1,
		        fillColor: '#71B3ff',
		        fillOpacity: 1
		    });
		    polygon.setPath(pathArray);
		    map.add(polygon)
		})
	}
    function destroyMap() {
         map && map.destroy();
         // log.info("地图已销毁");
       }
</script>
</body>
</html>